.topBar {
  width: 100%;
  position: fixed;
  background-color: @snColor;
  top: 0;
  left: 0;
  height: 90rem/@baseFontSize;
  z-index: 9999;

  a{
    position: absolute;
    top: 0;
    width: 90rem/@baseFontSize;
    height: 90rem/@baseFontSize;

    &.icon_category {
      left: 0;
      background: url("../image/icon_category.png") no-repeat center/44rem/@baseFontSize 70rem/@baseFontSize;
    }
    &.icon_cate {
      right: 0;
      background: url("../image/icon_cart.png") no-repeat center/63rem/@baseFontSize 68rem/@baseFontSize;
    }
  }

  form {
    width: 100%;
    height: 90rem/@baseFontSize;
    padding: 0 90rem/@baseFontSize;
    position: relative;

    .icon_search {
      position: absolute;
      top: 30rem/@baseFontSize;
      left: 100rem/@baseFontSize;
      width: 30rem/@baseFontSize;
      height: 30rem/@baseFontSize;
      background: url("../image/icon_search.png") no-repeat center/27rem/@baseFontSize 28rem/@baseFontSize;
    }

    input {
      width: 100%;
      height: 60rem/@baseFontSize;
      background-color: rgba(255,255,255,0.3);
      margin-top: 15rem/@baseFontSize;
      border-radius: 8rem/@baseFontSize;
      font-size: 24rem/@baseFontSize;
      padding-left: 50rem/@baseFontSize;
    }
  }
}